<?php
Yii::app()->clientScript->registerScriptFile($this->staticsPath."/frontend/js/jquery.js",CClientScript::POS_HEAD);
Yii::app()->clientScript->registerCssFile($this->staticsPath."/css/global.css");
Yii::app()->clientScript->registerCssFile($this->staticsPath."/css/index.css");
Yii::app()->clientScript->registerCssFile($this->staticsPath."/css/font-awesome.min.css");
Yii::app()->clientScript->registerCssFile($this->staticsPath."/Font-Awesome-3.2.1/css/font-awesome.min.css");

Yii::app()->clientScript->registerCss("CSS1","
    .cont_box img{
        height: 200px;
    }

   #loadings {
        left: 50%;
        position: absolute;
        top: 50%;
    }

");


?>
<style type="text/css">
    .main-box {
        background: #FDF2B9 url("<?php echo $this->staticsPath."/img/mypointlist.png" ?>") no-repeat scroll 0 0 / 100% auto;
        height: 100%;
        left: 0;
        margin: 0 auto;
        position: absolute;
        top: 0;
        width: 100%;
        z-index: -1;
    }
    .morcon {
        height: 100px;
        margin: 245px 20px 20px;
        position: relative;
        text-align: center;
    }

    .morcon .reg {
        background: rgba(255, 255, 255, 0) none repeat scroll 0 0;
        border: medium none;
        color: #fff;
        font-size: 20px;
        left: 4%;
        position: absolute;
        top: 0;
    }
    .morcon .login {
        background: rgba(255, 255, 255, 0) none repeat scroll 0 0;
        border: medium none;
        color: #fff;
        display: block;
        font-size: 20px;
        left: 51%;
        position: absolute;
        top: 39%;
    }

    .wrap .header{
        width: 100%;
        position: relative;
        height: 300px;
    }
    .wrap .footer {
        height: 300px;
        position: relative;
        width: 100%;
    }

    .wrap .header .mydodo{
        background: url("<?php echo $this->staticsPath."/img/mydodo.png" ?>") no-repeat scroll 0 0 / 150px auto;
        height: 40px;
        width: 150px;
        position: absolute;
        right: 15px;
        top: 25px;
    }
    .wrap .header .imgbg{
        background: url("<?php echo $this->staticsPath."/img/imgbg.png" ?>") no-repeat scroll 0 0 / 150px auto;
        height: 120px;
        width: 150px;
        position: absolute;
        left: 15px;
        top: 90px;
    }
    .imgbg .box{
        width: 100%;
        height: 100%;
        position: relative;
    }
    .imgbg .box img {
        border-radius: 50%;
        height: 80%;
        left: 15px;
        position: absolute;
        top: 15px;
        width: 80%;
    }
    .wrap .header .hname {
        height: 200px;
        left: 170px;
        position: absolute;
        top: 144px;
        width: 200px;
    }
    .wrap .header .hname p{
        color: #0066b3;
        font-size: 20px;
    }
    .wrap .header .list {


        height: 80px;
        left: 25px;
        position: absolute;
        top: 25px;
        width: 80px;
    }
    .wrap .header .list a{
        color: #0066b3;
        font-size: 30px;
    }



    .header {
        position: fixed;
        top:0;
    }


    .borders{
        width: 100%;
        position: relative;
        height: auto;
    }
    .borders .bg{
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: -1;
        border: 0;
    }
    .borders .tx{
        width: 30px;
        height: auto;
    }
    .borders .content {
        color: #555;
        font-size: 12px;
        padding: 11% 10px 15% 18%;
    }
    .borders .ptx{
        margin-top: 5px;
    }





    .wrap .header_box {
        height: 150px;
    }
    .wrap .header_box .imgbg{

        height: 120px;
        width: 120px;
        position: absolute;
        left: 15px;
        top: 18px;
    }
    .wrap .header_box .imgbg .box{
        width: 100%;
        height: 100%;
        position: relative;
    }
    .wrap .header_box .imgbg .box img {
        border-radius: 50%;
        height: 80%;
        left: 15px;
        position: absolute;
        top: 15px;
        width: 80%;
    }

    .wrap .header_box .hname {
        height: 120px;
        left: 0;
        position: absolute;
        top: 0;
        width: 120px;
    }
    .wrap .header_box .ph {
        height: 120px;
        left: 90px;
        position: absolute;
        top: 0;
        width: 100px;
    }
    .wrap .header_box .hname p{
        color: #0066b3;
        font-size: 20px;
    }
    .wrap .header_box .list {


        height: 80px;
        left: 25px;
        position: absolute;
        top: 25px;
        width: 80px;
    }
    .wrap .header_box .list a{
        color: #0066b3;
        font-size: 30px;
    }
    .imgbox{
        border: 2px dashed #fff;
    }
    .imgbox .box{
        float: left;
        width: 49%;
        height: 150px;
        position: relative;
    }
    .imgbox .box .list_box{

        height: 100%;
        width: 100%;
    }
    .imgbox .box .point1{
        background: url("<?php echo $this->staticsPath."/img/point1.png" ?>") no-repeat scroll 13px 0 / 130px auto;
        padding-left: 60px;
        padding-top: 66px;
    }
    .imgbox .box .point2{
        padding-left: 60px;
        padding-top: 42px;
        background: url("<?php echo $this->staticsPath."/img/point2.png" ?>") no-repeat scroll 13px 0 / 130px auto;
    }
    .imgbox .box .point3{
        padding-left: 60px;
        padding-top: 42px;
        background: url("<?php echo $this->staticsPath."/img/point3.png" ?>") no-repeat scroll 13px 0 / 130px auto;
    }
    .imgbox .box .point4{
        padding-left: 60px;
        padding-top: 60px;
        background: url("<?php echo $this->staticsPath."/img/point4.png" ?>") no-repeat scroll 13px 0 / 130px auto;
    }
    .imgbox .box .point5{
        padding-left: 60px;
        padding-top: 42px;
        background: url("<?php echo $this->staticsPath."/img/point5.png" ?>") no-repeat scroll 13px 0 / 130px auto;
    }
    .imgbox .box .point6{
        padding-left: 50px;
        padding-top: 30px;
        background: url("<?php echo $this->staticsPath."/img/point6.png" ?>") no-repeat scroll 13px 0 / 130px auto;
    }
    #loading {
        font-size: 30px;
        height: 50px;
        margin: 0 auto;
        text-align: center;
        width: 100px;
    }
    .alert-error {
        color: #b94a48;
    }
    .alert {
        border-radius: 4px;
        margin-bottom: 20px;
        padding: 8px 35px 8px 14px;
        text-align: center;
        text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
    }
    .ph .pm {
        color: yellow;
        font-size: 40px;
        margin-top: 20px;
        text-align: center;
    }
    .ph .pmimg{
        background: url("<?php echo $this->staticsPath."/img/paiming.png" ?>") no-repeat scroll 13px 0 / 75px auto;
        height: 47px;
        width: 115px;
    }
    .phselect{
        padding: 2px 35px;
    }
    .phselect .phse {
        color: #42b748;
        float: left;
        font-size: 18px;
        font-weight: 600;
        height: 50px;
        text-align: center;
        width: 33%;
    }
    .phselect .phse.active{
        background: url("<?php echo $this->staticsPath."/img/lv.png" ?>") no-repeat scroll 0 27px / 83px auto;
    }
    .content_box{
        padding: 2px 35px;
    }

    #min li{
        display: flex;
        background-color: #fbc5cd;
        padding: 5px 0;
    }
    #min li:nth-of-type(2n+1) {
        background-color: #fff9b9;
    }
    #min li div {
        float: left;
        text-align: center;
        width: 33%;
    }
    .header_box .rbox {
        height: 120px;
        left: 140px;
        position: absolute;
        top: 18px;
        width: 175px;
        overflow: hidden;
    }

    .header_box .rbox .rightbix {
        height: 100%;
        position: relative;
        width: 100%;
    }
</style>

<div class="data" >
    <div class="main-box"></div>
<!--    <header class="homeHder header">-->
<!--        <a href="--><?php //echo $this->createUrl('index',array('openid'=>$openid)) ?><!--">-->
<!--        <div class="hder_return flol">-->
<!---->
<!--                <i class="size fa fa-angle-left"></i>-->
<!---->
<!--        </div>-->
<!--        </a>-->
<!--        <div class="hder_logo">积分排行</div>-->
<!--    </header>-->
    <section class="wrap">
        <?php if($user_info->role==1){ ?>
        <div class="header_box">
            <div id="imgbg" class="imgbg">
                <div class="box">
                    <?php if($user_info->image){ ?>
                        <img src="<?php echo $user_info->image ?>">
                    <?php }else{ ?>
                        <?php if($user_info->sex ==1){ ?>
                            <img src="<?php echo $this->staticsPath."/img/tx1.jpg" ?>">
                        <?php }else{ ?>
                            <img src="<?php echo $this->staticsPath."/img/tx2.jpg" ?>">
                        <?php } ?>
                    <?php } ?>
                </div>
            </div>
            <div class="rbox">
                <div class="rightbix">
                <div class="hname">
                    <p style="color: #29BBF2; font-size: 20px; text-align: left; margin-top: 35px; "><?php echo $user_info->user_name ?></p>
                    <p style="color: #29BBF2; text-align: left; font-size: 20px; margin-top: 20px; margin-bottom: 25px;">积分:<b ><?php echo $user_info->point ?></b></p>
                </div>
                <div class="ph">
                    <div class="pm"><?php echo $paihang; ?></div>
                    <div class="pmimg"></div>
                </div>
                </div>
            </div>

        </div>
        <?php }elseif($user_info->role==2){ ?>
            <div class="header_box">
                <div id="imgbg" class="imgbg">
                    <div class="box">
                        <?php if($child_info->image){ ?>
                            <img src="<?php echo $child_info->image ?>">
                        <?php }else{ ?>
                            <?php if($child_info->sex ==1){ ?>
                                <img src="<?php echo $this->staticsPath."/img/tx1.jpg" ?>">
                            <?php }else{ ?>
                                <img src="<?php echo $this->staticsPath."/img/tx2.jpg" ?>">
                            <?php } ?>
                        <?php } ?>
                    </div>
                </div>
                <div class="rbox">
                    <div class="rightbix">
                        <div class="hname">
                            <p style="color: #0066b3; font-size: 22px; text-align: left; margin-top: 35px; "><?php echo $child_info->user_name ?></p>
                            <p style="color: #0066b3; text-align: left; font-size: 22px; margin-top: 20px; margin-bottom: 25px;">积分:<b ><?php echo $child_info->point ?></b></p>
                        </div>
                        <div class="ph">
                            <div class="pm"><?php echo $paihang; ?></div>
                            <div class="pmimg"></div>
                        </div>
                    </div>
                </div>
            </div>
        <?php }else{ ?>
        <div class="header_box"></div>
        <?php } ?>
        <div class="phselect clearfix">
            <div data-id="1" class="phse <?php if(Yii::app()->request->getParam('type')==1 || !Yii::app()->request->getParam('type')){ ?>active<?php } ?>">班级排行</div>
            <div data-id="2" class="phse <?php if(Yii::app()->request->getParam('type')==2){ ?>active<?php } ?>">年级排行</div>
            <div data-id="3" class="phse <?php if(Yii::app()->request->getParam('type')==3){ ?>active<?php } ?>">学校排行</div>
        </div>
        <div class="content_box">
            <ul id="min" class="imgbox clearfix">
               <li class="clearfix">
                   <div>排名</div>
                   <div>姓名</div>
                   <div>积分</div>
               </li>
                <?php if($list){ ?>
                <?php foreach($list as $k=>$v){ ?>
               <li class="clearfix">
                   <div><?php echo $k+1 ?></div>
                   <div><?php echo $v['user_name'] ?></div>
                   <div><?php echo $v['point'] ?></div>
               </li>
                <?php } ?>
                <?php } ?>




            </ul>
        </div>

    </section>
</div>

<script type="text/javascript">
    $(function(){
        $(".phse").click(function(){
            $(".phse").removeClass("active");
            $(this).addClass("active");
            var type = $(this).attr("data-id");
            if(type==2){
                window.location.href='<?php echo $this->createUrl('myPointlist',array('type'=>2,'openid'=>$openid)) ?>';
            }else if(type==3){
                window.location.href='<?php echo $this->createUrl('myPointlist',array('type'=>3,'openid'=>$openid)) ?>';
            }else if(type==1){
                window.location.href='<?php echo $this->createUrl('myPointlist',array('type'=>1,'openid'=>$openid)) ?>';
            }else{
                window.location.href='<?php echo $this->createUrl('myPointlist',array('openid'=>$openid)) ?>';
            }
        });
    });
</script>
